<template>
  <div class="container-fluid" style="margin-left: 140px">
    <div
      class="col col-lg-3 m-3"
      v-for="(item, index) in cakes"
      :key="index"
      style="float: left; margin: 0"
    >
      <div
        class="row"
        style="background-color: #fff; border: 1px solid gainsboro"
      >
        <div class="col col-12 justify-content-center mt-4">
          <img class="img3 mb-2 mt-2" :src="item.img" alt=" " />
        </div>
        <div class="col col-lg-7 mb-2">
          <span style="font-size: 18px; color: black"
            >【{{ item.text1 }}】</span
          >
        </div>
        <div class="col col-lg-4 mb-2"></div>
        <div
          class="col col-lg-11 mx-3 mb-2"
          style="overflow: hidden; height: 30px"
        >
          <small style="color: grey; font-size: 13px">{{ item.text2 }}</small>
        </div>
        <div class="row">
          <div class="col col-lg-4">
            <span style="color: tomato; font-size: 17px; padding-top: 10px"
              >{{ item.money }}元</span
            >
            <span style="color: tomato; font-size: 14px"> 起</span>
          </div>
          <div class="col col-lg-5"></div>
          <div class="col col-lg-3 mb-4">
            <!-- <router-link :to="'/detail/?id=' + item.id"> -->
              <button
               @click="gotoGoods(item)"
                class="float-lg-end buy"
                style="border: none; width: 70px; height: 30px; font-size: 13px"
              >
                购买>>
              </button>
            <!-- </router-link> -->
          </div>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
import axios from "axios";
export default {
  name: 'HomeView',
  data() {
    return {
      // isLogin:true,
      cakes: [],
    };
  },
     mounted(){
      axios.get("https://7482d18d-c979-4ece-9949-c0a51c924ce6.mock.pstmn.io/lxy",{
      }).then((res)=>{
        this.cakes=res.data
        console.log(this.cakes);
      }).catch(error=>{
        console.log(error);
      })
    },
    methods: {
       gotoGoods(item) {
        console.log('首页',item);
          this.$router.push({
          name:'detail',
          params:{
            id:item.id,
            text1:item.text1,
            text2:item.text2,
            money:item.money,
            count:item.count,
            totalPrice:item.totalPrice,
            isChecked:item.isChecked,
            static:item.static,
            img:item.img
          }
      })
    },
  },
};
</script>
